<template>
	<view style="height: 100vh; background-color: #FFFFFF;">
		<u-navbar title-color="#FFFFFF" height="48" back-icon-color="#FFFFFF" :border-bottom="false" :is-fixed="true" title="安全预警详情"></u-navbar>
		<uc-content :loading="loading">
			<view class="list-item">
				<view class="list-bottom">
					<view>预警名称:</view>
					<view>{{warningInfo.title}}</view>
				</view>
			</view>
			<view class="list-item" v-if="warningInfo.handlePersonName!=null">
				<view class="list-bottom">
					<view>执行人员:</view>
					<view>{{warningInfo.handlePersonName}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>上报时间:</view>
					<view>{{warningInfo.reportTime | dateFormat}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>业主名称:</view>
					<view>{{warningInfo.enterpriseName}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>预警描述:</view>
					<view>{{warningInfo.content}}</view>
				</view>
			</view>
			<view class="list-item">
				<view class="list-bottom">
					<view>所属区域:</view>
					<view>{{warningInfo.regionName}}</view>
				</view>
			</view>
			<view class="list-item"  v-if="warningInfo.handleStatus=='20'||warningInfo.handleResult">
				<view class="list-img">
					<view class="text">完成图片:</view>
					<view class="img" >
						<u-image v-if="warningInfo.handleResult" width="50%" height="450rpx" :src="warningInfo.handleResult+'?x-oss-process=style/zip_app'" mode="aspectFit">
							<u-loading slot="loading"></u-loading>
						</u-image>
						<u-image v-else width="50%" height="450rpx" :src="handleResult+'?x-oss-process=style/zip_app'" mode="aspectFit" @click="uploadPic">
							<u-loading slot="loading"></u-loading>
						</u-image>
					</view>
				</view>
			</view>
			<view>
				<u-button @click="determineHiddenDanger(warningInfo.ucId)" type="primary" size="medium" v-if="warningInfo.handleStatus=='10'" style="width: 99%;margin-top: 3px;">确认收到预警</u-button>
			</view>
			<view>
				<u-button @click="hiddenDangerUltimateEnd()" type="primary" size="medium" v-if="warningInfo.handleStatus=='20'&&handleResult!=null"  style="width: 99%;margin-top: 3px;">提交</u-button>
			</view>
		</uc-content>
	</view>
</template>


<script>
	export default {
		data() {
			return {
				warningInfo: {
					ucId: ''
				},
				fileList:[],
				loading: false,
				hidden:false,
				hidden1:true,
				abnormalPic: null,
				completeUrl:null
			}
		},
		onLoad(e) {
			this.warningInfo.ucId = e.ucId
			this.ucId = e.ucId
		},
		onShow() {
			this.initViews()
		},
		methods: {
			initViews(){
				this.loading = true
				this.getInHiddenDanger(this.warningInfo.ucId)
			},
			getInHiddenDanger(val) {
				this.utils.request("/api/app/warning/getData", {
					ucId: val
				}, "post", "app", true).then(res => {
					this.loading=false
					// console.log(res)
					this.warningInfo = res.data
				}).catch(error => {
					this.loading=false
					console.log(error)
				})
			},
			determineHiddenDanger(val){
				this.utils.request("/api/app/warning/confirm", {ucId: val}, "post", "app", true).then(res => {
					this.getInHiddenDanger(val)
				}).catch(error => {
					console.log(error)
				})
			},
			hiddenDangerUltimateEnd(){
				this.warningInfo.handleResult = this.handleResult
				this.utils.request("/api/app/warning/updateData", this.warningInfo, "post", "app", true).then(res => {
					// this.getInHiddenDanger(this.ucId)
					uni.navigateTo({
						url: '/pages/index/warning/index'
					});
				}).catch(error => {
					console.log(error)
				})
			},
			uploadPic(){
				window.native.h5Camera()
				window.native.getUri(res=>{
					console.log(res)
					this.handleResult = res.uri
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import "../../../uview-ui/libs/css/style.components.scss";
	.list-item {
		padding: 20rpx 40rpx;
		background-color: #fff;
		border-bottom: #999999 1px dashed ;
	
		.list-bottom {
			display: flex;
			margin-top: 10rpx;
			font-size: 28rpx;
			justify-content: space-between;
			color: #333;
		}
		.list-center {
			margin-top: 20rpx;
			font-size: 28rpx;
			color: #999999;
		}
		.list-img{
			display: flex;
			margin-top: 10rpx;
			font-size: 28rpx;
			color: #333;
			.text{
				flex: 1;
			}
			.img{
				flex: 3;
			}
		}
	}
</style>
